<template>
    <!-- 新契约退费任务查询-信函记录 -->
    <div class="fillcontain">

        <el-dialog
                title="信函记录"
                :visible.sync="drawer" 
                :width="'60%'"
				:height="'50%'"
                :before-close="handleClose"
                center>
            <div class="contain">
                <div class="table_container">
					<el-form>
						<el-form-item>
							<el-row>
								<el-col :span="24">
									<el-input :disabled="flag !='apo_new' && flag!='apo_update'" type="textarea" :row="10" id ="reasonText" v-model="reasonFail"></el-input>	
								</el-col>

								<!-- <el-col :span="8" style="float:right;margin-top: 0.625rem;">
                                    <el-button plain icon="el-icon-cancle" @click="handleClose()">取消</el-button>
									<el-button type="danger" class="Defaultbutton" :disabled="flag !='apo_new' && flag!='apo_update'" @click="modify()">修改</el-button>
								</el-col> -->
							</el-row>
						</el-form-item>
					</el-form>

                </div>
            </div>
             <span slot="footer" class="dialog-footer">
                <el-button plain icon="el-icon-cancle" @click="handleClose()">返回</el-button>
				 <el-button type="danger" class="Defaultbutton" :disabled="flag !='apo_new' && flag!='apo_update'" @click="modify()">确定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
    import {mapGetters} from 'vuex'
    import constant from '@/utils/constant';
	import TaskConstants,{call} from "@/api/taskManager/common"
    export default {
        name: "refund-fail-reason",
        data() {
            return {
                // 查询条件
                loading: false,
				reasonFail:'',
                pickerOptions1: {
                    disabledDate(time) {
                        return time.getTime() > Date.now();
                    }
                }
            }
        },
        created() {
        },
        mounted() {

        },
        props: {
            drawer: {
                type: Boolean,
                default: false
            },
            taskNo: {
                type: String
            },
			flag: {
				type: String
			},
        },
        methods: {

            handleClose(done) {
                this.$emit('close', this.drawer);
            },
            // 综合查询列表
            getReason(taskNo) {
                this.$store.dispatch('loading/CHANGE_LOADING', true)
                call(TaskConstants.apis.queryFailReason + taskNo).then(res => {
                    this.$store.dispatch('loading/CHANGE_LOADING', false)
                    if (res.resultCode == constant.SUCCESS && res.data) {
                        this.reasonFail = res.data;
                    }
                }).catch(err => {
                    this.$store.dispatch('loading/CHANGE_LOADING', false);
                })
            },
			modify() {
					/* 检查字符长度，超过500个拦截，但是db2数据库表测试了实际只能存494长度，故配置494 */
					if (this.reasonFail.getLength() > 494) {
						this.$message.error("信函内容长度不能超过500个字符！");
						return;
					}
					if (this.reasonFail=="" || undefined ==this.reasonFail ) {
						this.$message.error("信函内容不能为空！");
						return;
					}
					this.$store.dispatch('loading/CHANGE_LOADING', true);
					let param ={
						reason:this.reasonFail,
						taskno:this.taskNo
					}
					call(TaskConstants.apis.updateFailReason,param,"post").then( res =>{
					 this.$store.dispatch('loading/CHANGE_LOADING', false)
					if (res.resultCode == constant.SUCCESS ) {
					    this.$message.success(res.resultMsg);
					} else {
						this.$message.error(res.resultMsg);
					}
				})
			}
        },
        watch: {
            taskNo: function (newValue) {
                if (newValue != undefined && newValue != '')
                    this.getReason(newValue);
            },
			flag: function (newValue) {
				this.flag = newValue;
			}
        },
        computed: {
            ...mapGetters(['tags']),

        },
        activated() {
            if (this.reload) {
                this.$store.dispatch('loading/CHNAGE_RELOAD', false)
                Object.assign(this.$data, this.$options.data());
            }
        }
    }
</script>

<style lang="less" scoped>
    .fillcontain {
        padding-bottom: 0;
    }

    .contain {
        background: #fff;
        padding: 10px;
        margin-bottom: 20px;
    }

    .pagination {
        padding: 10px 20px;
        text-align: right;
    }

    .operationIcon {
        // padding: 12px;
        border: 1px solid #e5e5e5;
        border-radius: 50%;
        width: 22px;
        height: 22px;
        display: inline-block;
        cursor: pointer;
        box-shadow: 0 0 3px #f9f9f9;

        .svg-icon {
            font-size: 14px;
            fill: #68a3fc;
        }
    }

    .search_container {
        padding: 20px 20px 0 20px;
        border-top: 1px solid #e1e1e1;
    }
</style>



